<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>

  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">


  <title>H+ 后台主题UI框架 - 基础表格</title>
  <meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
  <meta name="description" content="H+是一个完全响应式，基于Bootstrap3最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术">

  <link rel="shortcut icon" href="/favicon.ico">
  <link href="/css/bootstrap.min.css?v=3.3.7" rel="stylesheet">
  <link href="/css/font-awesome.css?v=4.4.0" rel="stylesheet">
  <link href="/css/plugins/iCheck/custom.css" rel="stylesheet">
  <link href="/css/animate.css" rel="stylesheet">
  <link href="/css/style.css?v=4.1.0" rel="stylesheet">
  <!-- Sweet Alert -->
  <link href="/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
  <!-- Data Tables -->
  <link href="/css/plugins/dataTables/dataTables.bootstrap.css" rel="stylesheet">
  <style type="text/css">
  </style>


</head>

<body class="gray-bg">
  <div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
      <div class="col-sm-12">
        <div class="ibox float-e-margins">
          <div class="ibox-title">
            <h5>自定义响应式表格</h5>
            <div class="ibox-tools">
              <a class="collapse-link">
                <i class="fa fa-chevron-up"></i>
              </a>
              <a class="dropdown-toggle" data-toggle="dropdown" href="/table_basic.html#">
                <i class="fa fa-wrench"></i>
              </a>
              <ul class="dropdown-menu dropdown-user">
                <li><a href="/table_basic.html#">选项1</a>
                </li>
                <li><a href="/table_basic.html#">选项2</a>
                </li>
              </ul>
              <a class="close-link">
                <i class="fa fa-times"></i>
              </a>
            </div>
          </div>
          <div class="ibox-content">
            <div class="row">
              <div class="col-sm-9 m-b-xs">
                <a class="btn btn-success" href="/wanshu/role/goSaveOrUpdatePage">
                  <i class="fa fa-plus"></i> 新增
                </a>
                <!--<a class="btn btn-primary single disabled">
                    <i class="fa fa-edit"></i> 修改
                </a>
                <a class="btn btn-danger multiple disabled">
                    <i class="fa fa-remove"></i> 删除
                </a>-->
                <a class="btn btn-warning">
                  <i class="fa fa-download"></i> 导出
                </a>
              </div>

              <div class="col-sm-3">
                <div class="input-group">
                  <input type="text" name="key" id="formKey" th:value="${pageUtils.key}" placeholder="请输入关键词"
                         class="input-sm form-control">
                  <span class="input-group-btn">
                    <button type="button" onclick="search()" class="btn btn-sm btn-primary"> 搜索</button>
                  </span>
                </div>

              </div>
            </div>
            <div class="table-responsive">
              <table class="table table-striped">
                <thead>
                <tr>

                  <th></th>
                  <th>编号</th>
                  <th>角色名称</th>
                  <th>角色描述</th>
                  <th>排序</th>
                  <th>操作</th>
                </tr>
                </thead>
                <tbody>
                <tr th:each="role:${pageUtils.list}">
                  <td>
                    <input type="checkbox" class="i-checks" name="input[]">
                  </td>
                  <td>[[${role.id}]]</td>
                  <td>[[${role.roleName}]]
                  </td>
                  <td>[[${role.roleDesc}]]</td>
                  <td>[[${role.orderRank}]]</td>

                  <td>
                    <a th:href="'/wanshu/role/goSaveOrUpdatePage?id='+${role.id}"
                       class="btn btn-primary btn-sm ">
                      <i class="fa fa-edit"></i> 更新
                    </a>
                    <a th:href="'/wanshu/role/allocateMenu?id='+${role.id}"
                       class="btn btn-warning btn-sm ">
                      <i class="fa fa-edit"></i> 分配菜单
                    </a>
                    <a th:if="!${#strings.equals(role.roleName,'admin')}"
                       th:onclick="'deleteRole('+${role.id}+')'"
                       href="javascript:void(0)" class="btn btn-danger btn-sm ">
                      <i class="fa fa-remove"></i> 删除
                    </a>
                  </td>
                </tr>

                </tbody>
              </table>
            </div>

            <div th:include="common/basePage"></div>

          </div>
        </div>
      </div>

    </div>
  </div>

  <!-- 全局js -->
  <script src="/js/jquery.min.js?v=2.1.4"></script>
  <script src="/js/bootstrap.min.js?v=3.3.7"></script>


  <!-- Peity -->
  <script src="/js/plugins/peity/jquery.peity.min.js"></script>

  <!-- 自定义js -->
  <script src="/js/content.js?v=1.0.0"></script>


  <!-- iCheck -->
  <script src="/js/plugins/iCheck/icheck.min.js"></script>

  <!-- Peity -->
  <script src="/js/demo/peity-demo.js"></script>

  <script>
      $(document).ready(function () {
          $('.i-checks').iCheck({
              checkboxClass: 'icheckbox_square-green',
              radioClass: 'iradio_square-green',
          });
      });

      function deleteRole(roleId) {
          swal({
              title: "您确定要删除这条信息吗" + roleId,
              text: "删除后将无法恢复，请谨慎操作！",
              type: "warning",
              showCancelButton: true,
              confirmButtonColor: "#DD6B55",
              confirmButtonText: "删除",
              closeOnConfirm: false
          }, function () {
              // 做删除的操作
              $.get("/wanshu/role/deleteRole/" + roleId, function (data) {
                  if (data === 'success') {
                      location.href = "/wanshu/role/list"
                  } else {
                      alert("角色已经被分配，不能删除!!!");
                  }

              })

          });
      }


  </script>
  <script src="/js/plugins/sweetalert/sweetalert.min.js"></script>
  <script type="text/javascript" src="http:/tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
  <!--统计代码，可删除-->

</body>

</html>